<script type="text/javascript">
var settingTree = {
		check: {
			enable: true,
			chkboxType: {"Y":"", "N":""}
		},
		view: {
			dblClickExpand: false
		},
		data: {
			simpleData: {
				enable: true
			}
		},
		callback: {
			beforeClick: beforeClickTree,
			onCheck:     onCheckTree
		}
	};
	
	var zNodesTree =[
	    <volist name="cateList" id="v">
	    	{id:<php>echo $v['id'];</php>,pId:<php>echo $v['pid']</php>,name:"<php>echo $v['title'];</php>"},
	    </volist>
	 ];

	function beforeClickTree(treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeDemo");
		zTree.checkNode(treeNode, !treeNode.checked, null, true);
		return false;
	}
	
	function onCheckTree(e, treeId, treeNode) {
		var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
		nodes = zTree.getCheckedNodes(true),
		v = "";
		k = "";
		for (var i=0, l=nodes.length; i<l; i++) {
			v += nodes[i].name + ",";
			k += nodes[i].id + ",";
		}
		if (v.length > 0 ) v = v.substring(0, v.length-1);
		if (k.length > 0 ) k = k.substring(0, k.length-1);
		
		$("#citySelTree").attr("value", v);
		$("#menuValue").val(k);
	}

	function showMenuTree() {
		var cityObj = $("#citySelTree");
		var cityOffset = $("#citySelTree").offset();
		$("#menuContent").css({left:cityOffset.left + "px", top:cityOffset.top + cityObj.outerHeight() + "px"}).slideDown("fast");

		$("body").bind("mousedown", onBodyDownTree);
	}
	function hideMenuTree() {
		$("#menuContent").fadeOut("fast");
		$("body").unbind("mousedown", onBodyDownTree);
	}
	function onBodyDownTree(event) {
		if (!(event.target.id == "menuBtnTree" || event.target.id == "citySelTree" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {
			hideMenuTree();
		}
	}

	$(document).ready(function(){
		$.fn.zTree.init($("#treeDemo"), settingTree, zNodesTree);
	});
</script>